// JSON格式化工具
function openJsonTool() {
    const content = `
        <div class="button-group">
            <button class="action-btn" onclick="formatJson()">
                <i class="ri-format-line"></i>格式化
            </button>
            <button class="action-btn" onclick="compressJson()">
                <i class="ri-compress-line"></i>压缩
            </button>
            <button class="action-btn" onclick="copyJson()">
                <i class="ri-file-copy-line"></i>复制
            </button>
            <button class="action-btn" onclick="clearJson()">
                <i class="ri-delete-bin-line"></i>清空
            </button>
        </div>
        <div class="input-container">
            <div class="line-numbers" id="lineNumbers"></div>
            <textarea id="jsonInput" placeholder="请输入JSON字符串..."></textarea>
        </div>
    `;
    openModal('<i class="ri-braces-line"></i>JSON格式化', content);
    initJsonTool();
}

// Base64图片转换工具
function openBase64Tool() {
    const content = `
        <div id="dropZone">
            <i class="ri-upload-cloud-line"></i>
            <p>点击或拖拽图片到此处</p>
            <input type="file" id="fileInput" accept="image/*" style="display: none;">
        </div>
        <div class="image-preview-container" style="display: none;">
            <div class="button-group">
                <button class="action-btn" onclick="copyBase64()">
                    <i class="ri-file-copy-line"></i>复制Base64
                </button>
                <button class="action-btn" onclick="downloadImage()">
                    <i class="ri-download-line"></i>下载图片
                </button>
                <button class="action-btn" onclick="clearImage()">
                    <i class="ri-delete-bin-line"></i>清除
                </button>
            </div>
            <div class="preview-wrapper">
                <img id="imagePreview">
            </div>
            <div class="base64-output-wrapper">
                <textarea id="base64Output" readonly></textarea>
            </div>
        </div>
    `;
    openModal('<i class="ri-image-line"></i>图片Base64转换', content);
    initBase64Tool();
}

// 时间转换工具
function openTimeTool() {
    const content = `
        <div class="time-tool">
            <h3>时间转换工具开发中...</h3>
        </div>
    `;
    openModal('<i class="ri-time-line"></i>时间转换', content);
}

// 颜色转换工具
function openColorTool() {
    const content = `
        <div class="color-tool">
            <h3>颜色转换工具开发中...</h3>
        </div>
    `;
    openModal('<i class="ri-palette-line"></i>颜色转换', content);
}

// 初始化JSON工具
function initJsonTool() {
    const textarea = document.getElementById('jsonInput');
    const lineNumbers = document.getElementById('lineNumbers');
    
    // 更新行号
    function updateLineNumbers() {
        const lines = textarea.value.split('\n');
        lineNumbers.innerHTML = lines.map((_, i) => `<div>${i + 1}</div>`).join('');
    }
    
    textarea.addEventListener('input', updateLineNumbers);
    textarea.addEventListener('scroll', () => {
        lineNumbers.scrollTop = textarea.scrollTop;
    });
    
    updateLineNumbers();
}

// 初始化Base64工具
function initBase64Tool() {
    const dropZone = document.getElementById('dropZone');
    const fileInput = document.getElementById('fileInput');
    const previewContainer = document.querySelector('.image-preview-container');
    
    // 点击上传
    dropZone.addEventListener('click', () => fileInput.click());
    
    // 文件选择处理
    fileInput.addEventListener('change', handleFileSelect);
    
    // 拖拽处理
    dropZone.addEventListener('dragover', (e) => {
        e.preventDefault();
        dropZone.classList.add('dragover');
    });
    
    dropZone.addEventListener('dragleave', () => {
        dropZone.classList.remove('dragover');
    });
    
    dropZone.addEventListener('drop', (e) => {
        e.preventDefault();
        dropZone.classList.remove('dragover');
        const file = e.dataTransfer.files[0];
        if (file && file.type.startsWith('image/')) {
            handleFile(file);
        } else {
            showError('请选择图片文件');
        }
    });
}

// 处理文件选择
function handleFileSelect(e) {
    const file = e.target.files[0];
    if (file && file.type.startsWith('image/')) {
        handleFile(file);
    } else {
        showError('请选择图片文件');
    }
}

// 处理图片文件
function handleFile(file) {
    const reader = new FileReader();
    reader.onload = (e) => {
        const imagePreview = document.getElementById('imagePreview');
        const base64Output = document.getElementById('base64Output');
        const previewContainer = document.querySelector('.image-preview-container');
        
        imagePreview.src = e.target.result;
        base64Output.value = e.target.result;
        previewContainer.style.display = 'block';
    };
    reader.readAsDataURL(file);
}

// JSON格式化
function formatJson() {
    const textarea = document.getElementById('jsonInput');
    try {
        const json = JSON.parse(textarea.value);
        textarea.value = JSON.stringify(json, null, 4);
        showSuccess('格式化成功');
    } catch (e) {
        showError('JSON格式错误');
    }
}

// JSON压缩
function compressJson() {
    const textarea = document.getElementById('jsonInput');
    try {
        const json = JSON.parse(textarea.value);
        textarea.value = JSON.stringify(json);
        showSuccess('压缩成功');
    } catch (e) {
        showError('JSON格式错误');
    }
}

// 复制JSON
function copyJson() {
    const textarea = document.getElementById('jsonInput');
    textarea.select();
    document.execCommand('copy');
    showSuccess('复制成功');
}

// 清空JSON
function clearJson() {
    const textarea = document.getElementById('jsonInput');
    textarea.value = '';
    document.getElementById('lineNumbers').innerHTML = '<div>1</div>';
    showSuccess('已清空');
}

// 复制Base64
function copyBase64() {
    const base64Output = document.getElementById('base64Output');
    base64Output.select();
    document.execCommand('copy');
    showSuccess('Base64已复制');
}

// 下载图片
function downloadImage() {
    const imagePreview = document.getElementById('imagePreview');
    const link = document.createElement('a');
    link.download = 'image.' + imagePreview.src.split(';')[0].split('/')[1];
    link.href = imagePreview.src;
    link.click();
}

// 清除图片
function clearImage() {
    const previewContainer = document.querySelector('.image-preview-container');
    const fileInput = document.getElementById('fileInput');
    previewContainer.style.display = 'none';
    fileInput.value = '';
    showSuccess('已清除');
} 